<template>
    <a-row :gutter="16" type="flex">
        <a-col :span="7">
            <GroupList  class="flexCol"   @callBack="callBack" />

        </a-col>

        <a-col :span="17">
            <RuleMain  v-if="showRuleMain" :activeRecord="activeRecord"  class="flexCol"/>
        </a-col>

    </a-row>


</template>
<script>

    export default {
        components: {
            GroupList: () => import('./group/list'),
            RuleMain: () => import('./rule/main'),

        },
        data(){
            return {
                showRuleMain:true,
                activeRecord:{},
            }
        },

        methods:{
            callBack(e){

                this.activeRecord=e;
                if(e.code===this.activeRecord.groupCode){
                    this.showRuleMain=false;
                    setTimeout(()=>{

                        this.$nextTick(() => (this.showRuleMain = true))

                    },500);
                }





            }

        }


    };
</script>
